<template>
  <div>
    <div>

      <div class="main">
        <van-field
          label="事故编号"
          v-model="form.AccidentNumber"
          name="AccidentNumber"
          readonly
        >
        </van-field>
        <van-field
          label="事故名称"
          v-model="form.AccidentName"
          name="AccidentName"
          type="textarea"
          rows="1"
          autosize
          readonly
        >
        </van-field>
        <!-- <van-field label="所在位置" v-model="form.AccidentPlace" name="AccidentPlace" type="textarea" rows="1" autosize readonly></van-field>
                <van-field label="事故对象" v-model="form.AccidentObject" type="textarea" rows="2" v-if="form.SystemAccidentObject == 'A' || form.SystemAccidentObject == null" name="AccidentObject" readonly></van-field>
                <van-field label="后果事件" v-model="form.Consequence" type="textarea" rows="3" name="Consequence" readonly></van-field> -->
        <van-field
          label="事故发生部门"
          v-model="form.AccidentDepartmentName"
          name="AccidentDepartmentName"
          readonly
        ></van-field>
        <van-field
          label="事故发生日期"
          :value="form.AccidentDate|formatDateTime()"
          name="AccidentDate"
          readonly
        >
        </van-field>
        <van-field
          label="事故简介"
          v-model="form.Remarks"
          type="textarea"
          rows="1"
          autosize
          readonly
        />
        <van-field
          class="input_text"
          name="radio"
          label="工艺分类"
        >
          <template #input>
            <van-radio-group
              v-model="form.ProcessClassification"
              direction="horizontal"
              disabled
              style="padding-left: 8px;"
            >
              <van-radio
                name="A"
                style="margin: 0 10px 10px 0"
              >工艺</van-radio>
              <van-radio
                name="B"
                style="margin: 0 10px 10px 0"
              >非工艺</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          class="input_text"
          name="radio"
          label="事故分类"
          v-if="form.ProcessClassification=='A'"
        >
          <template #input>
            <van-radio-group
              v-model="form.AttidentClassification"
              direction="horizontal"
              disabled
              style="padding-left: 8px;"
            >
              <!-- <van-radio :name="item.ID" shape="square" v-for="(item, index) in form.AccidentProcessList" :key="index">{{ item.Name }}</van-radio> -->
              <van-radio
                v-for="(item, index) in form.AccidentProcessList"
                :key="index"
                :name="item.ID"
                style="margin: 0 10px 10px 0"
              >{{ item.Name }}</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          class="input_text"
          name="radio"
          label="事故分类"
          v-if="form.ProcessClassification=='B'"
        >
          <template #input>
            <van-radio-group
              v-model="form.AttidentClassification"
              direction="horizontal"
              disabled
              style="padding-left: 8px;"
            >
              <!-- <van-radio :name="item.ID" shape="square" v-for="(item, index) in form.AccidentProcessList" :key="index">{{ item.Name }}</van-radio> -->
              <van-radio
                v-for="(item, index) in form.AccidentFreeProcessList"
                :key="index"
                :name="item.ID"
                style="margin: 0 10px 10px 0"
                readonly
              >{{ item.Name }}</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          v-if="isShow(1)"
          class="input_text"
          name="checkboxGroup"
          label="伤害/职业病"
        >
          <template
            #input
            v-if="isShow(1)"
          >
            <van-checkbox-group
              v-model="harmArr"
              direction="horizontal"
              disabled
              style="padding-left: 10px;"
            >
              <van-checkbox
                :name="item.ID"
                shape="square"
                v-for="(item, index) in form.HarmList"
                :key="index"
              >{{ item.Name }}</van-checkbox>
            </van-checkbox-group>
          </template>
        </van-field>
        <van-field
          v-if="isShow(2)"
          label="火灾爆炸涉及范围"
          v-model="form.InvolveScope"
          type="textarea"
          rows="1"
          autosize
          readonly
        ></van-field>
        <van-field
          v-if="isShow(3)"
          label="环境污染范围"
          v-model="form.PolluteScope"
          type="textarea"
          rows="1"
          autosize
          readonly
        ></van-field>
        <van-field
          v-if="isShow(4)"
          label="泄露物质"
          v-model="form.RevealMatter"
          type="textarea"
          rows="1"
          autosize
          readonly
        ></van-field>
        <van-field
          v-if="isShow(4)"
          label="泄露量"
          v-model="form.Spillage"
          type="textarea"
          rows="1"
          autosize
          readonly
        ></van-field>
        <van-field
          v-if="isShow(5)"
          label="生产异常影响范围"
          v-model="form.SphereInfluence"
          type="textarea"
          rows="1"
          autosize
          readonly
        ></van-field>
        <van-field
          v-if="isShow(7)"
          label="直接财产损失"
          v-model="form.DirectPropertyLoss"
          type="textarea"
          rows="1"
          autosize
          readonly
        ></van-field>
        <van-field
          class="input_text"
          name="radio"
          label="事故分级"
          v-if="form.ProcessClassification=='A' || form.ProcessClassification=='B'"
        >
          <template
            #input
            disabled
          >
            <van-radio-group
              v-model="form.AttidentgRading"
              direction="horizontal"
              disabled
              style="padding-left: 8px;"
            >

              <van-radio
                v-for="(item, index) in form.AttidentgRadingList"
                :key="index"
                :name="item.ID"
                style="margin: 0 10px 10px 0"
              >{{ item.Name }}</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          class="input_text"
          name="radio"
          label="潜在风险"
        >
          <template
            #input
            disabled
          >
            <van-radio-group
              v-model="form.PotentialRisk"
              disabled
              direction="horizontal"
              style="padding-left: 8px;"
            >
              <van-radio
                v-for="(item, index) in form.PotentialRiskList"
                :key="index"
                :name="item.ID"
                style="margin: 0 10px 10px 0"
              >{{ item.Name }}</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          label="事故造成的影响"
          v-model="form.AccidentConsequence"
          type="textarea"
          rows="2"
          autosize
          readonly
        />
        <div class="report-block">
          <!-- <div slot="title">
                    <van-tag type="primary" size="large" mark>时间事件链</van-tag>
                </div> -->

          <van-collapse v-model="activeNames">
            <van-collapse-item
              name="1"
              class="cell-time-line"
            >
              <template #value>
                <van-tag
                  type="primary"
                  size="large"
                  mark
                >时间事件链</van-tag>
              </template>
              <van-list style="margin: 10px">
                <van-cell
                  style="margin-top: 10px"
                  class="cell-item"
                  v-for="(item, index) in form.Details"
                  :key="index"
                >
                  <van-row>
                    <van-col span="24">
                      日期/时间：{{ item.AccidentDate1 | formatDateTime }}
                    </van-col>
                  </van-row>
                  <van-row
                    gutter="20"
                    class="dep_sort"
                  >
                    <van-col span="24">
                      事件描述：{{ item.IncidentDescription }}
                    </van-col>
                  </van-row>
                  <van-row
                    gutter="20"
                    class="dep_sort"
                  >
                    <van-col span="24">
                      备注/证据说明：{{ item.EvidenceDescription }}
                    </van-col>
                  </van-row>
                </van-cell>
              </van-list>
            </van-collapse-item>
          </van-collapse>

        </div>

        <div class="report-block">
          <div
            slot="title"
            style="padding-top: 5px;"
          >
            <van-tag
              type="primary"
              size="large"
              mark
            >原因分析</van-tag>
          </div>
          <div
            class="det_tab"
            style="padding: 0"
          >
            <div class="det_tab_item">
              <!-- <van-tag type="primary" style="margin-left:0.45rem;" size="large" mark></van-tag> -->
              <van-field
                label="分析过程"
                v-model="form.ReasonAnalysis"
                type="textarea"
                rows="2"
                autosize
                readonly
              />
              <van-collapse v-model="activeNamesFactor">
                <van-collapse-item name="1">
                  <div slot="title">
                    <div>
                      <span class="title mr-30">关键因素</span>
                    </div>
                  </div>
                  <!-- <div slot="value" @click.stop="addFactorDetails()">
                                        <span class="valueclass">添加关键因素</span>
                                    </div> -->
                  <van-list style="margin: 10px">
                    <van-cell
                      style="margin-top: 10px"
                      class="cell-item"
                      v-for="(item, index) in form.Details2"
                      :key="index"
                    >
                      <van-row>
                        <van-col span="20">
                          {{ item.KeyFactor }}
                        </van-col>

                      </van-row>

                    </van-cell>
                  </van-list>
                </van-collapse-item>
              </van-collapse>
              <van-field
                label="直接原因"
                v-model="form.ImmediateCause"
                type="textarea"
                rows="2"
                autosize
                readonly
              />
              <van-field
                label="根本原因"
                v-model="form.PrimaryCause"
                type="textarea"
                rows="2"
                autosize
                readonly
              />
            </div>
          </div>
        </div>

        <div class="report-block">
          <!-- <div slot="title">
                    <van-tag type="primary" size="large" mark>整改与预防措施</van-tag>
                </div> -->
          <div
            class="det_tab"
            style="padding: 0"
          >
            <van-collapse v-model="activeNamesCorrectiveAction">
              <van-collapse-item
                name="1"
                class="cell-time-line"
              >
                <template slot="value">
                  <van-tag
                    type="primary"
                    size="large"
                    mark
                  >整改与预防措施</van-tag>
                </template>
                <van-list style="margin: 10px">
                  <van-cell
                    style="margin-top: 10px"
                    class="cell-item"
                    v-for="(item, index) in form.Details3"
                    :key="index"
                  >
                    <van-row>
                      <van-col span="24">
                        整改行动：{{ item.CorrectiveAction }}
                      </van-col>
                    </van-row>
                    <van-row>
                      <van-col span="24">
                        责任人：{{ item.PersonLiable }}
                      </van-col>
                    </van-row>
                    <van-row>
                      <van-col span="24">
                        完成日期：{{ item.FinishDate | formatDate }}
                      </van-col>
                    </van-row>
                  </van-cell>
                </van-list>
              </van-collapse-item>
            </van-collapse>
          </div>
        </div>

        <div class="report-block">
          <!-- <div slot="title">
                    <van-tag type="primary" size="large" mark>事故调查小组</van-tag>
                </div> -->

          <van-collapse v-model="activeNamesInvestigateGroup">
            <van-collapse-item
              name="1"
              class="cell-time-line"
            >
              <template #value>
                <van-tag
                  type="primary"
                  size="large"
                  mark
                >事故调查小组</van-tag>
              </template>
              <van-list style="margin: 10px">
                <van-cell
                  style="margin-top: 10px"
                  class="cell-item"
                  v-for="(item, index) in form.Details4"
                  :key="index"
                >
                  <van-row>
                    <van-col span="24"> 角色：{{ GetRole(item.Role) }} </van-col>
                  </van-row>
                  <van-row>
                    <van-col span="24"> 名称：{{ item.Name }} </van-col>
                  </van-row>
                  <van-row>
                    <van-col span="24"> 职务：{{ item.AccidentDuty }} </van-col>
                  </van-row>
                  <van-row>
                    <van-col span="24"> 电话：{{ item.Phone }} </van-col>
                  </van-row>
                  <van-row>
                    <van-col span="24"> 邮件：{{ item.Email }} </van-col>
                  </van-row>
                </van-cell>
              </van-list>
            </van-collapse-item>
          </van-collapse>
        </div>
        <div class="report-block">
          <van-field
            class="input_text"
            name="checkboxGroup"
            label="需要加强的HSE管理要素
"
          >
            <template #input>
              <van-checkbox-group
                v-model="HSEManagementList"
                direction="horizontal"
                disabled
                style="padding-left: 8px;"
              >
                <van-checkbox
                  :name="item.ID"
                  shape="square"
                  v-for="(item, index) in form.HSEManagementList"
                  :key="index"
                >{{ item.Name }}</van-checkbox>
              </van-checkbox-group>
            </template>
          </van-field>
          <van-field
            label="经验教训
"
            v-model="form.InvestigationTeam"
            type="textarea"
            rows="2"
            autosize
            readonly
          />
          <van-list style="margin: 10px">
            <van-cell
              style="margin-top: 10px;padding-left: 0px;"
              class="cell-item"
              v-for="(item, index) in form.AuditData"
              :key="index"
            >
              <van-row>
                <van-col
                  span="8"
                  style="padding-left: 0px;text-align: left;color:#646566"
                >
                  {{item.LevelName}}
                </van-col>
                <van-col
                  span="16"
                  style="padding-left: 10px;"
                >
                  {{item.OperateContent}}
                </van-col>
              </van-row>
            </van-cell>
          </van-list>
          <!-- <template v-for="(item, index) in form.AuditData">
                        <tbody :key="index">
                            <tr>
                                <td>{{item.LevelName}}</td>
                                <td>{{item.OperateContent}}</td>
                            </tr>
                        </tbody>
                    </template> -->
          <FileUpload
            @CallBack="_fileUploadCb"
            :attachs="form.Attachs"
            :allowEdit="false"
            :labelName="'附件'"
          />

        </div>

      </div>
    </div>

  </div>
</template>
<script>
import {
  WhAccidentInitialReportSave,
  GetView,
  getDangerDetail,
} from "@/api/WhInvestigationReport";
import { mapGetters } from "vuex";
import FileUpload from "@/components/Attach/FileUpload";
import VanFieldSelectPicker from "@/components/VanFieldSelectPicker.vue";
export default {
  components: {
    VanFieldSelectPicker,
    FileUpload,
  },
  data() {
    return {
      form: {},
      AttidentClassificationArr: [], //checkboxgroup 必须是数组类型
      harmArr: [],
      minDate: new Date(2015, 0, 1),
      showAccidentAreaDialog: false,
      activeNames: ["1"],
      timeEventChain: {
        ID: 0,
        AccidentDate: null,
        IncidentDescription: "",
        EvidenceDescription: "",
        index: -1,
      },
      correctiveAction: {
        CorrectiveAction: "",
        PersonLiable: "",
        FinishDate: "",
        index: -1,
      },
      keyFactor: {
        KeyFactor: "",
        index: -1,
      },
      investigateGroup: {
        Role: "",
        Name: "",
        AccidentDuty: "",
        Phone: "",
        Email: "",
        index: -1,
      },
      show: false,
      minDate: new Date(2020, 0, 1),
      maxDate: new Date(2025, 10, 1),
      currentDate: new Date(),
      timeValue: "请选择时间",
      timeShow: false,
      isLoadingShow: true,
      className: "",
      activeNameReasonAnalysis: "reasonAnalysis",
      activeNamesFactor: ["1"],
      factorShow: false,
      activeNameCorrectiveAction: "correctiveAction",
      activeNamesCorrectiveAction: ["1"],
      correctiveActionShow: false,
      activeNameInvestigateGroup: "investigateGroup",
      activeNamesInvestigateGroup: ["1"],
      investigateGroupShow: false,
      HSEManagementList: [],
    };
  },
  computed: {
    ...mapGetters(["baseUrl", "CompanyCode", "roles"]),
  },
  created() {
    let id = this.$route.query.id;
    this.GetView1(id);
  },
  methods: {
    getDetail() {},
    handleChecked() {
      this.form.AttidentClassification = this.AttidentClassificationArr.join();
    },
    attidentClassifyChange(val) {
      if (this.edit == true) {
        this.edit = false;
        return false;
      }
      if (val) {
        this.form.AttidentClassification = "";
        this.AttidentClassificationArr = [];
      }
    },
    GetView1(id) {
      const param = {
        id: id,
      };
      var _this = this;
      getDangerDetail(param).then((res) => {
        _this.form = res.data;
        if (res.data.Harm != null) {
          _this.harmArr = res.data.Harm.split(",");
        }

        _this.edit = true;
        if (res.data.HSEManagement != null) {
          _this.HSEManagementList = res.data.HSEManagement.split(",");
        }
      });
    },
    isShow(value) {
      if (
        this.form.AttidentClassification &&
        this.form.AttidentClassification.indexOf(value) > -1 &&
        (value != "4" || this.form.ProcessClassification == "A") &&
        (value != "5" || this.form.ProcessClassification == "A") &&
        (value != "7" || this.form.ProcessClassification == "B")
      ) {
        return true;
      }
      return false;
    },
    _fileUploadCb(attachs) {
      this.form.Attachs = attachs;
    },
    harmChange() {},
    setAttidentgRadingValue(data1, index, data2) {
      // data1 当前这一条的obj数据
      // index 当前选择的索引
      // data2 当前这一条数据的value
      // this.form.AttidentgRading = data1.ID;
      // this.form.AttidentgRadingName = data1.Name;
    },
    onChangeAccidentPlace(val) {
      this.form.AccidentConsequence = val + this.form.AccidentObject;
    },
    onChangeAccidentObject(val) {
      this.form.AccidentConsequence = this.form.AccidentPlace + val;
    },
    addDetails() {
      this.show = true;
    },
    confirm() {
      if (this.timeEventChain.index >= 0) {
        var editData = this.form.Details[this.timeEventChain.index];
        editData.AccidentDate = this.timeEventChain.AccidentDate;
        editData.IncidentDescription = this.timeEventChain.IncidentDescription;
        editData.EvidenceDescription = this.timeEventChain.EvidenceDescription;
        this.initTimeEventChain();
      } else {
        this.form.Details.push({
          ID: 0,
          AccidentDate: this.timeEventChain.AccidentDate,
          IncidentDescription: this.timeEventChain.IncidentDescription,
          EvidenceDescription: this.timeEventChain.EvidenceDescription,
        });
      }
      this.show = false;
    },
    initTimeEventChain() {
      this.timeEventChain.ID = 0;
      this.timeEventChain.AccidentDate = null;
      this.timeEventChain.IncidentDescription = "";
      this.timeEventChain.EvidenceDescription = "";
      this.timeEventChain.index = -1;
    },
    close() {
      this.show = false;
    },
    // 显示弹窗
    showPopup() {
      this.timeShow = true;
      this.isLoadingShow = true;
      setTimeout(() => {
        this.isLoadingShow = false;
      }, 500);
    },
    // 确认选择的时间
    confirmPicker(val) {
      let year = val.getFullYear();
      let month = val.getMonth() + 1;
      let day = val.getDate();
      let hour = val.getHours();
      let minute = val.getMinutes();
      if (month >= 1 && month <= 9) {
        month = `0${month}`;
      }
      if (day >= 1 && day <= 9) {
        day = `0${day}`;
      }
      if (hour >= 0 && hour <= 9) {
        hour = `0${hour}`;
      }
      if (minute >= 0 && minute <= 9) {
        minute = `0${minute}`;
      }
      this.className = "timeClass";
      this.timeValue = `${year}-${month}-${day} ${hour}:${minute}`;
      this.timeShow = false;
      this.timeEventChain.AccidentDate = this.timeValue;
    },
    // 选项格式化函数
    formatter(type, value) {
      if (type === "year") {
        return `${value}年`;
      } else if (type === "month") {
        return `${value}月`;
      } else if (type === "day") {
        return `${value}日`;
      } else if (type === "hour") {
        return `${value}时`;
      } else if (type === "minute") {
        return `${value}分`;
      } else if (type === "second") {
        return `${value}秒`;
      }
      return value;
    },
    editTimeEventChain(data, index) {
      this.timeEventChain.AccidentDate = data.AccidentDate;
      this.timeEventChain.IncidentDescription = data.IncidentDescription;
      this.timeEventChain.EvidenceDescription = data.EvidenceDescription;
      this.timeEventChain.index = index;
      this.show = true;
    },
    deleteTimeEventChain(index) {
      this.form.Details.splice(index, 1);
    },
    addFactorDetails() {
      this.factorShow = true;
    },
    initKeyFactor() {
      this.keyFactor.KeyFactor = "";
      this.keyFactor.index = -1;
    },
    confirmKeyFactor() {
      if (this.keyFactor.index >= 0) {
        var editData = this.form.Details2[this.keyFactor.index];
        editData.KeyFactor = this.keyFactor.KeyFactor;
      } else {
        this.form.Details2.push({
          KeyFactor: this.keyFactor.KeyFactor,
        });
      }
      this.initKeyFactor();
      this.factorShow = false;
    },
    closeKeyFactor() {
      this.factorShow = false;
    },
    editKeyFactor(data, index) {
      this.keyFactor.KeyFactor = data.KeyFactor;
      this.keyFactor.index = index;
      this.factorShow = true;
    },
    deleteKeyFactor(index) {
      this.form.Details2.splice(index, 1);
    },
    addCorrectiveActionDetails() {
      this.correctiveActionShow = true;
    },
    initCorrectiveAction() {
      this.correctiveAction.CorrectiveAction = "";
      this.correctiveAction.PersonLiable = "";
      this.correctiveAction.FinishDate = null;
      this.correctiveAction.index = -1;
    },
    confirmCorrectiveAction() {
      if (this.correctiveAction.index >= 0) {
        var editData = this.form.Details3[this.correctiveAction.index];
        editData.CorrectiveAction = this.correctiveAction.CorrectiveAction;
        editData.PersonLiable = this.correctiveAction.PersonLiable;
        editData.FinishDate = this.correctiveAction.FinishDate;
      } else {
        this.form.Details3.push({
          CorrectiveAction: this.correctiveAction.CorrectiveAction,
          PersonLiable: this.correctiveAction.PersonLiable,
          FinishDate: this.correctiveAction.FinishDate,
        });
      }
      this.initCorrectiveAction();
      this.correctiveActionShow = false;
    },
    closeCorrectiveAction() {
      this.correctiveActionShow = false;
    },
    editCorrectiveAction(data, index) {
      this.correctiveAction.CorrectiveAction = data.CorrectiveAction;
      this.correctiveAction.PersonLiable = data.PersonLiable;
      this.correctiveAction.FinishDate = data.FinishDate;
      this.correctiveAction.index = index;
      this.correctiveActionShow = true;
    },
    deleteCorrectiveAction(index) {
      this.form.Details3.splice(index, 1);
    },
    addInvestigateGroupDetails() {
      this.investigateGroupShow = true;
    },
    initInvestigateGroup() {
      this.investigateGroup.Role = "";
      this.investigateGroup.Name = "";
      this.investigateGroup.AccidentDuty = "";
      this.investigateGroup.Phone = "";
      this.investigateGroup.Email = "";
      this.investigateGroup.index = -1;
    },
    confirmInvestigateGroup() {
      if (this.investigateGroup.index >= 0) {
        var editData = this.form.Details4[this.investigateGroup.index];
        editData.Role = this.investigateGroup.Role;
        editData.Name = this.investigateGroup.Name;
        editData.AccidentDuty = this.investigateGroup.AccidentDuty;
        editData.Phone = this.investigateGroup.Phone;
        editData.Email = this.investigateGroup.Email;
      } else {
        this.form.Details4.push({
          Role: this.investigateGroup.Role,
          Name: this.investigateGroup.Name,
          AccidentDuty: this.investigateGroup.AccidentDuty,
          Phone: this.investigateGroup.Phone,
          Email: this.investigateGroup.Email,
        });
      }
      this.initInvestigateGroup();
      this.investigateGroupShow = false;
    },
    GetRole(val) {
      if (val == "A") {
        return "组长";
      } else {
        return "组员";
      }
    },
    closeInvestigateGroup() {
      this.investigateGroupShow = false;
    },
    editInvestigateGroup(data, index) {
      this.investigateGroup.Role = data.Role;
      this.investigateGroup.Name = data.PersonLiable;
      this.investigateGroup.AccidentDuty = data.AccidentDuty;
      this.investigateGroup.Phone = data.Phone;
      this.investigateGroup.Email = data.Email;
      this.investigateGroup.index = index;
      this.investigateGroupShow = true;
    },
    deleteInvestigateGroup(index) {
      this.form.Details4.splice(index, 1);
    },
  },
};
</script>
<style lang="less" scoped>
.valueclass {
  color: rgb(0, 195, 224);
  margin-right: 0.3rem;
}
.report-block {
  background-color: #fff;
  margin-top: 0.5rem;
}
/deep/ .cell-time-line {
  padding-top: 3px;
  .van-cell {
    padding-left: 0px;
  }
}
.valueclass {
  margin-right: 0.3rem;
  float: right;
}

.time-link-dialog {
  height: 9rem;
}

.factor-dialog {
  height: 4.5rem;
}

.corrective-action-dialog {
  height: 8rem;
}
/deep/.van-field__error-message {
  color: unset;
}
.bottom-btns {
  margin-top: 10px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .submit-btn {
    width: 30%;
    height: 30px;
    font-size: 12px;
  }
  .submit-only {
    width: 100%;
    height: 30px;
    font-size: 12px;
  }
  .submit-two {
    width: 48%;
    height: 30px;
    font-size: 12px;
  }
}

.det_tab {
  padding: 10px;
  .det_tab_item {
    padding: 10px 0;
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 10px;

    .det_tab_item_text {
      padding: 0 10px;
    }
  }
}

/deep/ .van-collapse-item__content {
  padding: 0rem;
}

.report-block {
  background-color: #fff;
  margin-top: 0.5rem;
}
/deep/ .valueclass[data-v-f75fe2f8] {
  margin-right: 0.3rem;
  float: right;
  height: 23px;
  width: 50px;
}

/deep/ .cell-time-line {
  padding-top: 3px;
  .van-cell {
    padding-left: 0px;
  }
}
</style>